<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
	<meta name="mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="description" content="NG6-Starter by @AngularClass">

	<link rel="stylesheet" href="css/common.css">
	<link rel="stylesheet" href="css/base.css">
</head>

<body>
	<div class="header">
        <a href="javascript:;" class="ui-header-button left">返回</a>
		<h3 class="title">我的任务</h3>
        <a href="javascript:;" class="ui-header-button right">用户:XXX(真名)</a>
	</div>
    <div class="select-bar">
        <div class="select-box">
            <span class='select-text'>
                标题状态<i></i>
            </span>
            <select name="" id="">
                <option value="">待审核</option>
                <option value="">待复审</option>
                <option value="">待修改</option>
                <option value="">合格</option>
            </select>
        </div>
        <div class="select-box">
            <span class='select-text'>
                结算状况<i></i>
            </span>
            <select name="" id="">
                <option value="">待审核</option>
                <option value="">待复审</option>
                <option value="">待修改</option>
                <option value="">合格</option>
            </select>
        </div>
        <div class="select-box">
            <span class='select-text'>
                权限栏目<i></i>
            </span>
            <select name="" id="">
                <option value="">待审核</option>
                <option value="">待复审</option>
                <option value="">待修改</option>
                <option value="">合格</option>
            </select>
        </div>
    </div>
    <div class="select-bar">
        <div class="select-box">
            <span class="select-text">
                起始时间
            </span>
            <input type="date" class="timebox">
        </div>
        <div class="select-box">
            <span class="select-text">
                结束时间
            </span>
            <input type="date" class="timebox">
        </div>
    </div>
    <div class="select-bar">
        <div class="select-box border-none">
            <a href="" class="ui-button button-blue-light">查询标题任务</a>
        </div>
        <div class="select-box border-none">
            <a href="" class="ui-button button-blue-light">统计待结算</a>
        </div>
        <div class="select-box border-none">
            <a href="" class="ui-button button-blue-light">统计已结算</a>
        </div>
    </div>

    <div class="form-result">
        <div class="form-title">
            佣金统计结果
        </div>
        <div class="form-data">
            <span class="label">待结算佣金</span>
            <span class="result">80元</span>
        </div>
        <div class="form-data">
            <span class="label">已结算佣金</span>
            <span class="result">200元</span>
        </div>
    </div>
    <div class="form-result">
        <div class="form-title">
            标题任务列表
        </div>
        <a class="label-link">
				<i class="ui-mark b">审</i>
				<span class="assign-text">长标题自动动做省略号长长…</span>
			</a>
			<a class="label-link">
				<i class="ui-mark g">改</i>
				<span class="assign-text">长标题自动做省略号长长…</span>
			</a>
    </div>
    <div id="drag">点击加载更多</div>
   
  
	<script src="lib/dist/jquery.1.11.js"></script>
	<script src="lib/app.js"></script>
	<script src='lib/src/base.js'></script>
    <script>
        $(function(){
            var select = $('div.select-box select')
            var datetime = $('div.select-box input.timebox')
            select.on('change', function(){
                var text = $(this).find('option:selected').text()
                var arrow = '<i></i>'
                $(this).siblings('.select-text').html(text + arrow)
            })
            datetime.on('input propertychange', function(){
                var text = $(this).val()
                var date = new Date(text)
                var year = date.getFullYear()
                var month = date.getMonth() + 1
                month >= 10 ? month : '0' + month
                var day = date.getDate()
                day >= 10 ? day : '0' + day

                $(this).siblings('.select-text').html(year + '-' + month +'-' + date.getDate())
            })
        })
    </script>
</body>

</html>